/* eslint-disable */
/**
/**
 * Created by GYL on 2018/7/25
 */
import React, { Component } from 'react';
import MyModal from '../../../components/common/MyModal';
import { Collapse, Icon, Select, Input, Form, Row, Col, TreeSelect, Tag, Popconfirm, Tree, Divider, message, Spin, Switch } from 'antd';
import request from '../../../utils/request';
import styles from '../EventPosting.less';
import Edit_file from './Edit_file';
const IconFont = Icon.createFromIconfontCN({
    scriptUrl: '//at.alicdn.com/t/font_1315525_kt2bd7ytf.js',
});

const { TreeNode } = Tree;

class File extends Component {

    state = {
        spinning: false,
        treeData: [],
        selectedKeys: [],
        MyModal1VisibleSmall: false,
        siteName: '',
        recordId: '',
        type: '',
        checked: true,
        modalBtnLoading:false
    }

    componentDidMount() {

        //获取文件树结构
        this.getFileSiteTree(true)
    }
    //获取文件树结构
    getFileSiteTree = (checked) => {
        this.setState({
            spinning: true
        })
        request({
            url: '/pm-web/projectmanage/filesite/getFileSiteTree',
            method: 'POST',
            data: { siteType: checked ? '1' : '2' }
        }).then(data => {
            // console.log(data)
            if (data.rc === 0) {
                this.setState({
                    treeData: data.ret.tmList,
                    expandedKeys: data.ret.idList,
                    spinning: false
                })
                this.getTypeById()
            }
        })
    }


    //根据id获取按钮状态
    getTypeById = () => {
        this.setState({
            spinning: true
        })
        request({
            url: '/pm-web/projectmanage/filesite/getTypeById',
            method: 'POST',
            data: { id: this.state.selectedKeys[0], siteType: this.state.checked ? '1' : '2' }
        }).then(data => {
            // console.log(data)
            if (data.rc === 0) {
                this.setState({
                    sc: data.ret.sc,
                    sy: data.ret.sy,
                    xg: data.ret.xg,
                    xy: data.ret.xy,
                    xztj: data.ret.xztj,
                    xzxj: data.ret.xzxj,
                    spinning: false
                })
            }
        })
    }

    onExpand = expandedKeys => {
        // console.log('onExpand', expandedKeys);
        // if not set autoExpandParent to false, if children expanded, parent can not collapse.
        // or, you can remove all expanded children keys.
        this.setState({
            expandedKeys,
            autoExpandParent: false,
        });
    };

    renderTreeNodes = data =>
        data.map(item => {
            if (item.children) {
                return (
                    <TreeNode title={item.title} key={item.key} dataRef={item}>
                        {this.renderTreeNodes(item.children)}
                    </TreeNode>
                );
            }
            return <TreeNode key={item.key} {...item} />;
        });



    onSelect = (selectedKeys, info) => {
        // console.log('onSelect', selectedKeys);
        if (selectedKeys.length < 1) {
            return
        }
        this.setState({ selectedKeys }, () => {
            this.getTypeById()
        });
    }

    // 取消保存
    ModalCancel = (type) => {
        let t = this;
        t.setState({
            [type]: false,
            modalBtnLoading: false
        })
    };

    //子事件保存
    onModalSaveSmall = (v) => {
        // console.log(v, this.state.type)
        this.setState({
            modalBtnLoading:true
        })
        if (this.state.type == 3) {
            request({
                url: '/pm-web/projectmanage/filesite/updateFileSite',
                method: 'POST',
                data: { pitchOnId: this.state.selectedKeys[0], id: v.recordId, siteName: v.siteName, siteType: this.state.checked ? '1' : '2' }
            }).then(data => {
                if (data.rc === 0) {
                    message.success('修改成功')
                    //获取文件树结构
                    this.getFileSiteTree(this.state.checked)
                    this.setState({
                        MyModal1VisibleSmall: false,
                        selectedKeys: [v.recordId]
                    })
                } else {
                    message.warning(`${data.err}`)
                }

                this.setState({
                    modalBtnLoading:false
                })
            })
        } else {
            request({
                url: '/pm-web/projectmanage/filesite/insertFileSite',
                method: 'POST',
                data: { pitchOnId: this.state.selectedKeys[0], siteName: v.siteName, type: this.state.type, id: v.recordId, siteType: this.state.checked ? '1' : '2' }
            }).then(data => {
                if (data.rc === 0) {
                    message.success('操作成功')
                    //获取文件树结构
                    this.getFileSiteTree(this.state.checked)
                    this.setState({
                        MyModal1VisibleSmall: false
                    })
                } else {
                    message.warning(`${data.err}`)
                }

                this.setState({
                    modalBtnLoading:false
                })
            })
        }

    }

    xztj = () => {
        this.setState({
            MyModal1VisibleSmall: true,
            type: 1,
            siteName: '',
            recordId: '',
        })
    }


    xzxj = () => {
        this.setState({
            MyModal1VisibleSmall: true,
            type: 2,
            siteName: '',
            recordId: '',
        })
    }

    onUp = () => {
        request({
            url: '/pm-web/projectmanage/filesite/moveFileSite',
            method: 'POST',
            data: { id: this.state.selectedKeys[0], moveType: 1, siteType: this.state.checked ? '1' : '2' }
        }).then(data => {
            if (data.rc === 0) {
                message.success('操作成功')
                //获取文件树结构
               this.getFileSiteTree(this.state.checked)



            }
        })

    }

    onDown = () => {
        request({
            url: '/pm-web/projectmanage/filesite/moveFileSite',
            method: 'POST',
            data: { id: this.state.selectedKeys[0], moveType: 2, siteType: this.state.checked ? '1' : '2' }
        }).then(data => {
            if (data.rc === 0) {
                message.success('操作成功')
                //获取文件树结构
               this.getFileSiteTree(this.state.checked)
            }
        })
    }

    onDelte = () => {
        request({
            url: '/pm-web/projectmanage/filesite/deleteFileSite',
            method: 'POST',
            data: this.state.selectedKeys
        }).then(data => {
            if (data.rc === 0) {
                message.success('删除成功')
                //获取文件树结构
               this.getFileSiteTree(this.state.checked)

                this.setState({
                    selectedKeys: []
                }, () => {
                    this.getTypeById()
                })
            }
        })
    }

    onSave = () => {
        request({
            url: '/pm-web/projectmanage/filesite/findOneById',
            method: 'POST',
            data: { id: this.state.selectedKeys[0], siteType: this.state.checked ? '1' : '2' }
        }).then(data => {
            if (data.rc === 0) {
                this.setState({
                    siteName: data.ret.siteName,
                    recordId: data.ret.id
                }, () => {
                    this.setState({
                        MyModal1VisibleSmall: true,
                        type: 3
                    })
                })
            }
        })
    }


    confirm = (e) => {
        this.onDelte()
    }

    cancel = (e) => {
    }

    onchecked = (checked) => {
        this.setState({
            checked,
            selectedKeys: ''
        }, () => {
            this.getTypeById()
        })
        this.getFileSiteTree(checked)

    }
    render() {
        let t = this;
        let { getFieldDecorator } = t.props.form;
        const {modalBtnLoading} = this.state;
        return (
            <Spin spinning={this.state.spinning} size='large'>
                <Switch checkedChildren="新模板" unCheckedChildren="旧模板" defaultChecked style={{ marginLeft: 10 }} checked={this.state.checked} onChange={this.onchecked} />
                <div style={{ width: '100%', height: '80vh', display: 'flex', flexDirection: 'column', padding: 10, backgroundColor: '#fff' }}>
                    {
                        this.state.MyModal1VisibleSmall && <Edit_file
                            ModalCancel={this.ModalCancel.bind(this, 'MyModal1VisibleSmall')}
                            siteName={this.state.siteName}
                            recordId={this.state.recordId}
                            onModalSave={this.onModalSaveSmall}
                            modalBtnLoading={modalBtnLoading}
                        />
                    }
                    <Row>
                        <h2 style={{ fontSize: 14, fontWeight: 700 }}>

                            <span style={{ padding: 3, marginLeft: 15, cursor: 'pointer', color: '#3996FF', display: this.state.xztj ? '' : 'none' }} onClick={this.xztj}>
                                <IconFont type="icon-xinzeng" />  添加同级目录
                        </span>

                            <span style={{ padding: 3, marginLeft: 15, cursor: 'pointer', color: '#3996FF', display: this.state.xzxj ? '' : 'none' }} onClick={this.xzxj}>
                                <IconFont type="icon-xinzeng" />  添加下级目录
                        </span>




                            <span onClick={this.onUp} style={{ padding: 3, marginLeft: 15, fontSize: 14, cursor: 'pointer', width: 20, height: 20, color: '#16B8BD', display: this.state.sy ? '' : 'none' }}>
                                <IconFont type="icon-shangyi" />
                                上移
                            </span>

                            <span onClick={this.onDown} style={{ padding: 3, marginLeft: 15, fontSize: 14, cursor: 'pointer', width: 20, height: 20, color: '#F58989', display: this.state.xy ? '' : 'none' }}>
                                <IconFont type="icon-xiayi2" />
                                下移
                            </span>
                            <Popconfirm
                                title="确定删除此条数据?"
                                onConfirm={this.confirm}
                                onCancel={this.cancel}
                                okText="是"
                                cancelText="否"
                            >
                                <span style={{ padding: 3, marginLeft: 15, fontSize: 14, cursor: 'pointer', width: 20, height: 20, color: '#F58989', display: this.state.sc ? '' : 'none' }}>
                                    <IconFont type="icon-shanchu" />
                                    删除
                            </span>
                            </Popconfirm>

                            <span style={{ padding: 3, marginLeft: 15, cursor: 'pointer', color: '#3996FF', display: this.state.xg ? '' : 'none' }} onClick={this.onSave}>
                                <IconFont type="icon-tongyi" />  修改
                        </span>

                        </h2>
                    </Row>
                    <div style={{ flex: '1', display: 'flex', paddingBottom: 50, overflow: 'auto' }}>
                        <div style={{ width: '100%' }}>

                            <Tree
                                // defaultExpandAll={true}
                                onExpand={this.onExpand}
                                expandedKeys={this.state.expandedKeys}
                                // autoExpandParent={this.state.autoExpandParent}
                                onSelect={this.onSelect}
                                selectedKeys={this.state.selectedKeys}
                            >
                                {this.renderTreeNodes(this.state.treeData)}
                            </Tree>

                        </div>


                    </div>
                </div>
            </Spin>
        )
    }
}
export default Form.create()(File);
